<template>
    <div>
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item> <i class="el-icon-lx-calendar"></i> 工资管理 </el-breadcrumb-item>
                <el-breadcrumb-item>参数详情</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="container">
            <div class="form-box">
                <el-form ref="form" :model="form" label-width="80px">
                    <el-divider content-position="left">参数详情</el-divider>

                    <el-form-item label="职位名称" prop="name">
                        <el-input v-model="position.name" disabled></el-input>
                    </el-form-item>

                    <el-form-item label="基础工资" prop="name">
                        <el-input v-model="form.basicSalary" disabled>
                            <template slot="append">/月</template>
                        </el-input>
                    </el-form-item>

                    <el-form-item label="全勤奖" prop="name">
                        <el-input v-model="form.fullAttention" disabled>
                            <template slot="append">/月</template>
                        </el-input>
                    </el-form-item>

                    <el-form-item label="岗位补贴" prop="name">
                        <el-input v-model="form.positionSalary" disabled>
                            <template slot="append">/月</template>
                        </el-input>
                    </el-form-item>

                    <el-form-item label="加班工资" prop="name">
                        <el-input v-model="form.overtimeSalary" disabled>
                            <template slot="append">/小时</template>
                        </el-input>
                    </el-form-item>

                    <el-form-item label="其他补贴" prop="name">
                        <el-input v-model="form.subsidy" disabled>
                            <template slot="append">/月</template>
                        </el-input>
                    </el-form-item>

                    <el-form-item label="请假扣款" prop="name">
                        <el-input v-model="form.leaveDeduction" disabled>
                            <template slot="append">/小时</template>
                        </el-input>
                    </el-form-item>

                    <el-form-item label="迟到扣款" prop="name">
                        <el-input v-model="form.lateDeduction" disabled>
                            <template slot="append">/小时</template>
                        </el-input>
                    </el-form-item>

                    <el-form-item label="其他扣款" prop="name">
                        <el-input v-model="form.otherDeduction" disabled>
                            <template slot="append">/天</template>
                        </el-input>
                    </el-form-item>

                    <el-form-item>
                        <el-button @click="goback" icon="el-icon-arrow-left">返回</el-button>
                    </el-form-item>
                </el-form>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    name: 'baseform',
    inject: ['reload'],
    data() {
        return {
            id: this.$route.query.id,
            position: {},
            form: {}
        };
    },
    created: function () {
        this.init();
    },
    methods: {
        goback() {
            this.$router.go(-1);
        },
        async init() {
            var a = await this.$http.get('/param/' + this.id);

            if (a.code == 200) {
                this.form = a.data;
                this.getPositionById(a.data.pid);
                this.$message.success(a.message);
            } else {
                this.$message.error(a.message);
            }
        },
        //获取职位
        async getPositionById(pid) {
            if(pid=='1'){
                this.position.name="基础参数"
            }else{
            var a = await this.$http.get('/position/' + pid);
            if (a.code == 200) {
                this.position = a.data;
            }
            }
        }
    }
};
</script>